/*关于CSS中的部分兼容问题的写法汇总*/

/*compatible_01:背景的颜色渐变的写法*/
.bgGradientcolor {
    background:#008ce4; background-size:250% 100%;
    background: -webkit-gradient(linear, 0 100%, 0 0, from(#0981c7), to(#008de7), to(#0981c7));
    background: -webkit-linear-gradient(left, #002740, #008de7, #002740);
    background: -moz-linear-gradient(left, #002740, #008de7, #002740);
    background: -o-linear-gradient(left, #002740, #008de7, #002740);
    background: -ms-linear-gradient(left, #002740, #008de7, #002740);
    background: linear-gradient(to left, #002740, #008de7, #002740);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = #002740, endColorstr = #008de7);
}

/*compatible_02:input输入框中的placeholder属性的兼容性写法*/
/*input_placeholder*/
input::-webkit-input-placeholder {color:#999;}
input::-moz-placeholder {color:#999;}
input:-moz-placeholder {color:#999;}
input:-ms-input-placeholder {color:#999;}

/*compatible_03:background-opacity的兼容处理*/
/*在FF\Chrome等高阶浏览器中使用rgba即可实现，但是在垃圾的IE浏览器下面是不兼容rgba的写法。*/
.background-opacity{rgba(0,0,0,.5);filter:alpha(opacity=50);}
/*进阶处理：背景有透明度需求，但是div盒子里的内容不需要做透明处理。*/
.box {filter:progid.DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = #80000000, endColorstr = #80000000);}
:root .box {filter:none; background:#000; rgba(0,0,0,.5);}/*——————IE9不需要filter*/

/*----------------备注用法细节-----------------*/
/*GradientType: 参数1-->横向渐变  参数0-->纵向渐变*/
/*startColorstr/endColorstr: ---后6位是代表颜色【十六进制颜色】---前两位代表的是透明度【opacity】*/
/*对应的公式数字：

rgba:      # 0.1 ### 0.2 ### 0.3 ### 0.4 ### 0.5 ### 0.6 ### 0.7 ### 0.8 ### 0.9 #
           #######################################################################
iefilter:  # 19  ### 33  ### 4C  ### 66  ### 7F  ### 99  ### B2  ### C8  ### E5  #

*/

/*背景渐变色的透明。保证盒子内部的文本不受到外面的盒子的透明度影响：*/
/*****
<box 外部用以固定选区的盒子，内部的背景色和文本均使用定位来进行实现，并且保证其z-index属性的合理使用>
    <div>背景渐变色透明</div>
    <span>文本txt</span>
</box>

*****/

